<template>
    <a-modal
        :title="title"
        :width="900"
        :visible="visible"
        :confirmLoading="confirmLoading"
        @ok="handleOk"
        @cancel="handleCancel"
        :okButtonProps="{ props: {disabled: disabled} }"
        cancelText="关闭">

        <a-spin :spinning="confirmLoading">
            <a-form :form="form">
                <a-row style="width: 100%;">
                    <a-col :span="24">
                        <a-form-item
                            :labelCol="labelCol"
                            :wrapperCol="wrapperCol"
                            label="类型名称">
                            <a-input placeholder="请输入类型名称" v-decorator="['typeName', validatorRules.typeName]"
                                     :readOnly="disableSubmit"/>
                        </a-form-item>
                    </a-col>
                    <a-col :span="24">
                        <a-form-item
                            :labelCol="labelCol"
                            :wrapperCol="wrapperCol"
                            label="类型描述">
                            <a-textarea placeholder="请输入类型描述" v-decorator="['typeDescribe', ]"
                                     :readOnly="disableSubmit"/>
                        </a-form-item>
                    </a-col>


                    <a-col :span="24">
                        <a-form-item
                            :labelCol="labelCol"
                            :wrapperCol="wrapperCol"
                            label="类型图片"
                            class="j-field-content">
                            <j-image-upload isMultiple v-decorator="['typeImage']"></j-image-upload>
                        </a-form-item>
                    </a-col>
                </a-row>
            </a-form>
        </a-spin>
    </a-modal>
</template>

<script>
import { httpAction } from '@api/manage'
import pick from 'lodash.pick'
import { getAction } from '@api/manage'
import JDate from '@comp/jeecg/JDate'
import JEditor from '@comp/jeecg/JEditor'
import moment from 'moment'

export default {
    components: { JEditor, JDate,  },
    name: 'lawTypeModal',
    data() {
        return {
            title: '操作',
            visible: false,
            disableSubmit: false,
            model: {},
            labelCol: {
                xs: { span: 24 },
                sm: { span: 6 }
            },
            wrapperCol: {
                xs: { span: 24 },
                sm: { span: 18 }
            },

            confirmLoading: false,
            form: this.$form.createForm(this),
            validatorRules: {
                typeName: { rules: [{ required: true, message: '请输入类型名称!' }] },
                description: { rules: [{ required: true, message: '请输入条款描述!' }] }
            },
            url: {
                queryByIds: '/sys/user/queryByIds',
                add: '/hc/hcLawEnforcementType/add',
                edit: '/hc/hcLawEnforcementType/edit'
            },
            userType: false,
            userIds: [],
            selectedUser: [],
            disabled: false,
            msgContent: '',
            userList: []
        }
    },
    created() {
    },
    methods: {
        add() {
            this.edit({})
        },
        edit(record) {
            this.form.resetFields()
            this.model = {}
            this.disable = false
            this.visible = true
            this.getUser(record)
        },
        getUser(record) {
            this.model = Object.assign({}, record)
            this.$nextTick(() => {
                this.form.setFieldsValue(pick(this.model, 'typeName', 'typeDescribe', 'typeImage', ))
            })
        },
        close() {
            this.$emit('close')
            this.selectedUser = []
            this.visible = false
        },
        handleOk() {
            const that = this
            // 触发表单验证
            this.form.validateFields((err, values) => {
                if (!err) {
                    that.confirmLoading = true
                    let httpurl = ''
                    let method = ''
                    if (!this.model.id) {
                        httpurl += this.url.add
                        method = 'post'
                    } else {
                        httpurl += this.url.edit
                        method = 'put'
                    }
                    let formData = Object.assign(this.model, values)
                    httpAction(httpurl, formData, method).then((res) => {
                        if (res.success) {
                            that.$message.success(res.message)
                            that.$emit('ok')
                        } else {
                            that.$message.warning(res.message)
                        }
                    }).finally(() => {
                        that.confirmLoading = false
                        that.close()
                    })

                }
            })
        },
        handleCancel() {
            this.visible = false
            this.$emit('close')
        },

    }
}
</script>

<style scoped>

</style>
